<!DOCTYPE html>
<html lang="en">
  <head>
    {{ template "head" }}
    <link rel="stylesheet" href="/static/css/index.css" />
    <title>{{ .siteTitle }}</title>
  </head>
  <body>
    <div id="main">
      <h1>{{ .siteName }}</h1>

      <div class="section">
        <h2>Board list</h2>
        <div>
          <ul>
            {{ range $key, $value := .boardsByCategory }}
            <li>
              <h3>{{ $key }}</h3>
              <ul>
                {{ range $value }}
                <li>
                  <a href="/b/{{ .Path }}">{{ .Name }}</a>
                </li>
                {{ end }}
              </ul>
            </li>
            {{ end }}
          </ul>
        </div>
      </div>

      <div class="section">
        <h2>Recent threads</h2>
        <div id="recentThreadSection">
          {{ range $key, $thread := .recent }}
          <a
            href="/b/{{ $key }}/{{ idToString $thread.ID }}"
            class="featuredThreadLink"
          >
            <div class="featuredThread">
              <h3>{{ $key }}</h3>
              {{ if $thread.Image }}
              <img
                src="data:image/png;base64,{{ .Image }}"
                alt="anon-image"
                width="180"
              />
              {{ end }}
              <h4>{{ $thread.Title }}</h4>
              {{ if $thread.Posts }} {{ with $thread.GetMostRecentPost }}
              <p>{{ .AuthorId }}</p>
              <blockquote>{{ .Body }}</blockquote>
              {{ end }} {{ else }}
              <blockquote>{{ $thread.Body }}</blockquote>
              {{ end }}
            </div>
          </a>
          {{ end }}
        </div>
      </div>
    </div>
  </body>
</html>
